*{
    margin:0%;
    padding:0%;
    box-sizing: border-box;
}

html,body{

    height: 100%;
    width:100%;
    background-color: rgb(9, 62, 32);
}

h4{

    color:goldenrod;
    font-size: 15px;
}

.logo{


    width:100%;
    display: flex;
}

.anim-cont{

height:30%;
width:100%;
text-align: center;
position: relative;
padding-top: 20px;
color:rgba(241, 249, 10, 0.767);

}

nav{
 background-image: url("mobile\ cover\'s\ nav\ img.jpg");


}


ul{

   background-color: whitesmoke;
}
a{
 margin-left: 30px;
font-family:𝐇𝐎𝐌𝐄;
font-size: 20px;
}

a:hover{

    transform: scale(1.1,1.1);
}

.d1{
    color:black;
     height: 50%;
     width:100%;
    
     background-color:gray;
     display: flex;
 }
 
 .d1:hover{
 
     transform: translatey(-10%);
     backdrop-filter: blur("90%");
 }
 .box1{
 
     height: 100%;
     width: 40%;
     background-size: cover;
 }
 
 .box2{
     height: 100%;
     width:60%;
     padding: 10px;
  
 }

.d2{
    height: 100%;
    width: 100%;
    background-color: rgb(9, 62, 32);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.slidebox{

    height: 100%;
    width: 100%;
}
   


button{
    padding:10px;
    border:none;
    background-color: rgb(189, 118, 66);
    color:beige;
  
}

button:hover{

    background-color: rgb(9, 62, 32);
    color: bisque;
}
.brand-name{
color: bisque;
text-align: center;
}